<#assign ctx=request.contextPath />
<!doctype html>
<html xmlns="http://www.w3.org/1999/html">
<head>
    <meta charset="utf-8">
    <title>自定义标签</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="renderer" content="webkit">
    <!-- CSS文件 -->
    <link href="${ctx}/css/bootstrap.min.css" rel="stylesheet">
    <link href="${ctx}/css/global.css" rel="stylesheet">
    <link href="${ctx}/css/plugins/footable/footable.core.css" rel="stylesheet">
    <link href="${ctx}/css/style.css" rel="stylesheet">
    <!--layui-->
    <link href="${ctx}/layui/css/modules/layer/default/layer.css" rel="stylesheet">
</head>

<style>
    input[type=checkbox], input[type=radio] {
        margin: 0;
    }

    .form-inline label {
        margin-right: 10px;
    }

</style>

<body>
<div style="padding: 15px;">
    <div style="height: 1px; background-color: #e5e5e5; margin-top: 20px;"></div>
    <div class="wrapper wrapper-content table-responsive">
        <table class="table table-hover" id="tabList" data-page-size="10" data-filter=#filter data-limit-navigation="5">
            <thead>
            <tr>
                <th nowrap="nowrap">序号</th>
                <th nowrap="nowrap">标签名</th>
                <th nowrap="nowrap">操作</th>
            </tr>
            </thead>
            <tbody id="tbodyDiv">
            <#list list as customTag>
            <tr id="tr_${customTag.id}">
                <td nowrap="nowrap">${customTag_index+1}</td>
                <td nowrap="nowrap">${customTag.tag}</td>
                <td nowrap="nowrap">
                    <a class="btn btn-warning btn-sm" href="${ctx}/updateTagView?id=${customTag.id}">修改</a>&nbsp;&nbsp;&nbsp;
                    <button class="btn btn-danger btn-sm" onclick="deleteTag('${customTag.tag}',${customTag.id});">删除</button>&nbsp;&nbsp;&nbsp;
                </td>
            </tr>
            </#list>
            </tbody>
        <#--分页部分-->
            <tfoot id="foot">
            <tr>
                <td colspan="20">
                    <ul class="pagination"></ul>
                </td>
            </tr>
            </tfoot>
        </table>
    </div>
<#-- 搜索无内容显示 -->
    <div class="box_1" id="noData" <#if (list?size>0)>style="display: none;"</#if>>
        <i class="fa fa-frown-o fa-5x"></i>
        <p>抱歉，没有数据</p>
    </div>
</div>
<script src="${ctx}/js/jquery.min.js?v=2.1.4"></script>
<script src="${ctx}/js/bootstrap.min.js?v=3.3.6"></script>
<script src="${ctx}/js/plugins/footable/footable.all.min.js"></script>
<script src="${ctx}/layui/lay/modules/layer.js"></script>
<script>

    //自动分页必须初始化
    $(document).ready(function () {
        $('#tabList').footable({
            "paging": {
                "enabled": true
            },
            "sorting": {
                "enabled": false
            }
        });
    });

    //删除
    function deleteTag(name, id) {
        layer.msg('你确定删除' + name + '？', {
            time: 0 //不自动关闭
            , btn: ['确定', '取消']
            , yes: function (index) {
                layer.close(index);
                deletes(id);
            }
        });
    }

    function deletes(id) {
        $.get("${ctx}/deleteCustomTag",
                {id: id},
                function success(res) {
                    layer.msg(res.msg);
                    if (res.status == 0) {
                        $('tr#tr_' + id).remove();
                        $('#tabList').trigger('footable_initialize');// 表格数据重载、分页重载
                    }
                })
    }

</script>
</body>
</html>
